<template>
  <div class="app-container" style="background: #fff">
    <ehead :showmenu="false"></ehead>
    <div>
      <div
        class="content"
        style="
          padding: 20px;
          background-image: url('https://ecodestore.oss-cn-beijing.aliyuncs.com/%E6%96%B0%E7%89%88UI%E5%9B%BE%E6%A0%87/pc/urls/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20241108100311.png'); /* 设置背景图片 */
          background-repeat: no-repeat; /* 背景图片不重复 */
          background-size: 100% 360px; /* 背景图片覆盖整个元素，保持宽高比 */
        "
      >
        <div style="font-size: 30px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
          购买VIP会员，享受更多权益
        </div>
        <div style="font-size: 20px; color: rgb(0 0 0 / 100%); text-align: center">
          一次性购买多年，可享受最低六折优惠点击【立即购买】进入购买页可详细查看
        </div>
        <div
          style="
            padding: 20px;
            margin: 20px;
            background-color: rgb(255 255 255 / 100%);
            border-radius: 20px;
            box-shadow: 0 2px 6px 0 rgb(0 0 0 / 40%);
          "
        >
          <table class="t1" style="background: #fff">
            <tr>
              <!-- <td style="width: 300px; height: 100px; background-color: #fff; border-top: none; border-left: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  免费版
                </div>
              </td>
              <td style="width: 300px; height: 100px; background-color: #fff; border-top: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  基础版
                </div>
              </td>
              <td style="width: 300px; height: 100px; background-color: #fff; border-top: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  高级版
                </div>
              </td>
              <td style="width: 300px; height: 100px; background-color: #fff; border-top: none; border-right: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  旗舰版
                </div>
              </td> -->
              <td
                v-for="(o, i) in list"
                :key="i"
                style="width: 300px; height: 100px; background-color: #fff; border-top: none"
                :style="{ borderLeft: i == 0 ? 'none' : '', borderRight: i == list.length - 1 ? 'none' : '' }"
              >
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  {{ o.tName }}
                </div>
              </td>
              <!-- <td style="width: 200px; height: 100px; background-color: #fff; border-top: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  企业专属版
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff; border-top: none; border-right: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  代理商
                </div>
              </td> -->
            </tr>
            <tr>
              <td
                v-for="(o, i) in list"
                :key="i"
                style="width: 300px; height: 100px; background-color: #fff; border-top: none"
                :style="{ borderLeft: i == 0 ? 'none' : '', borderRight: i == list.length - 1 ? 'none' : '' }"
              >
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  ￥{{ o.tFee }}/年
                </div>
              </td>
              <!-- <td style="width: 200px; height: 100px; background-color: #fff; border-left: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  ￥ 0/年
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  ￥ 680/年
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  ￥ 1280/年
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff; border-right: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  ￥ 2980/年
                </div>
              </td> -->
              <!-- <td style="width: 200px; height: 100px; background-color: #fff">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  ￥ 6980/年
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff; border-right: none">
                <div style="font-size: 20px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  ￥ 10000/年
                </div>
              </td> -->
            </tr>
            <tr>
              <td style="width: 200px; height: 100px; background-color: #fff; border-left: none">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">0元</div>
              </td>
              <td style="width: 200px; height: 100px; text-decoration: line-through; background-color: #fff">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">1200元</div>
              </td>
              <td style="width: 200px; height: 100px; text-decoration: line-through; background-color: #fff">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">3600元</div>
              </td>
              <td
                style="
                  width: 200px;
                  height: 100px;
                  text-decoration: line-through;
                  background-color: #fff;
                  border-right: none;
                "
              >
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">7200元</div>
              </td>
              <!-- <td style="width: 200px; height: 100px; text-decoration: line-through; background-color: #fff">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">9980元</div>
              </td>
              <td
                style="
                  width: 200px;
                  height: 100px;
                  text-decoration: line-through;
                  background-color: #fff;
                  border-right: none;
                "
              >
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">20000/年</div>
              </td> -->
            </tr>
            <tr>
              <td style="width: 200px; height: 100px; background-color: #fff; border-left: none">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                  <el-button
                    class="mt-10"
                    color="#333333"
                    size="large"
                    style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                    >使用</el-button
                  >
                </div>
              </td>
              <td style="width: 200px; height: 100px; text-decoration: line-through; background-color: #fff">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                  <el-button
                    class="mt-10"
                    color="#F8D202"
                    size="large"
                    style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                    @click="open"
                    >立即购买
                  </el-button>
                </div>
              </td>
              <td style="width: 200px; height: 100px; text-decoration: line-through; background-color: #fff">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                  <el-button
                    class="mt-10"
                    color="#F8D202"
                    size="large"
                    style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                    @click="open"
                    >立即购买
                  </el-button>
                </div>
              </td>
              <td
                style="
                  width: 200px;
                  height: 100px;
                  text-decoration: line-through;
                  background-color: #fff;
                  border-right: none;
                "
              >
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                  <el-button
                    class="mt-10"
                    color="#F8D202"
                    size="large"
                    style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                    @click="open"
                    >立即购买
                  </el-button>
                </div>
              </td>
              <!-- <td style="width: 200px; height: 100px; text-decoration: line-through; background-color: #fff">
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                  <el-button
                    class="mt-10"
                    color="#F8D202"
                    size="large"
                    style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                    >立即购买
                  </el-button>
                </div>
              </td>
              <td
                style="
                  width: 200px;
                  height: 100px;
                  text-decoration: line-through;
                  background-color: #fff;
                  border-right: none;
                "
              >
                <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                  <el-button
                    class="mt-10"
                    color="#F8D202"
                    size="large"
                    style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                    >立即购买
                  </el-button>
                </div>
              </td> -->
            </tr>
            <tr>
              <td
                v-for="(o, i) in list"
                :key="i"
                style="width: 200px; height: 100px; background-color: #fff; border-bottom: none"
                :style="{ borderLeft: i == 0 ? 'none' : '', borderRight: i == list.length - 1 ? 'none' : '' }"
              >
                <div style="font-size: 16px; font-weight: bold; color: rgb(0 0 0 / 100%); text-align: center">
                  <div v-for="(o2, i2) in o.titleDesc">
                    {{ o2 }}
                  </div>
                </div>
              </td>
              <!-- <td style="width: 200px; height: 100px; background-color: #fff; border-bottom: none; border-left: none">
                <div class="cell-div" style="font-size: 14px; color: rgb(0 0 0 / 100%); text-align: center">
                  50M图片/视频文件容量<br />
                  500M音频/视频容量<br />
                  音频/视频播放限5次<br />
                  亿码互联标识<br />
                  基础表单功能
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff; border-bottom: none">
                <div class="cell-div" style="font-size: 14px; color: rgb(0 0 0 / 100%); text-align: center">
                  1G图片/视频文件容量<br />
                  10G音频/视频容量<br />
                  300G音频/视频高清流量<br />
                  H5打开方式<br />
                  【无标识小程序】打开<br />
                  去除亿码互联标识<br />
                  加购容量提升包
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff; border-bottom: none">
                <div class="cell-div" style="font-size: 14px; color: rgb(0 0 0 / 100%); text-align: center">
                  3G图片/视频文件容量<br />
                  30G音频/视频容量<br />
                  600G音频/视频高清流量<br />
                  表单全功能<br />
                  2个子管理员<br />
                  加购容量提升包<br />
                  二维码误删除恢复
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff; border-right: none; border-bottom: none">
                <div class="cell-div" style="font-size: 14px; color: rgb(0 0 0 / 100%); text-align: center">
                  30G图片/视频文件容量<br />
                  150G音频/视频容量<br />
                  4500G音频/视频高清流量 <br />5个子管理员 <br />专属行业顾问 <br />加购容量提升包
                </div>
              </td> -->
              <!-- <td style="width: 200px; height: 100px; background-color: #fff; border-bottom: none">
                <div class="cell-div" style="font-size: 14px; color: rgb(0 0 0 / 100%); text-align: center">
                  拥有专属小程序<br />
                  扫码进入自己的小程序<br />
                  自定义编辑小程序主页 <br />大规模应用 <br />企业独立管理后台<br />
                  20个子管理员<br />
                  落地指导和培训
                </div>
              </td>
              <td style="width: 200px; height: 100px; background-color: #fff; border-right: none; border-bottom: none">
                <div style="font-size: 14px; color: rgb(0 0 0 / 100%); text-align: center">会员成交按比例分成</div>
              </td> -->
            </tr>
          </table>
        </div>
      </div>
      <div
        style="margin-top: 40px; font-size: 30px; font-weight: bold; color: rgb(16 16 16 / 100%); text-align: center"
      >
        各版本详细对比
      </div>
      <div class="content" style="margin-top: 24px">
        <table class="t2" style="width: 100%">
          <tr>
            <td
              style="height: 28px; font-size: 20px; line-height: 28px; color: rgb(16 16 16 / 100%); text-align: center"
            >
              功能版本对比
            </td>
            <td
              v-for="(o, i) in list"
              :key="i"
              style="height: 28px; font-size: 20px; line-height: 28px; color: rgb(16 16 16 / 100%); text-align: center"
            >
              <div>
                {{ o.tName }}
              </div>
              <div>￥{{ o.tFee }}/年</div>
            </td>
            <!-- <td
              style="height: 28px; font-size: 20px; line-height: 28px; color: rgb(16 16 16 / 100%); text-align: center"
            >
              <div>免费版</div>
              <div>￥ 0/年</div>
            </td>
            <td
              style="height: 28px; font-size: 20px; line-height: 28px; color: rgb(16 16 16 / 100%); text-align: center"
            >
              <div>基础版</div>
              <div>￥ 680/年</div>
            </td>
            <td
              style="height: 28px; font-size: 20px; line-height: 28px; color: rgb(16 16 16 / 100%); text-align: center"
            >
              <div>高级版</div>
              <div>￥ 1280/年</div>
            </td>
            <td
              style="height: 28px; font-size: 20px; line-height: 28px; color: rgb(16 16 16 / 100%); text-align: center"
            >
              <div>旗舰版</div>
              <div>￥ 2980/年</div>
            </td> -->
            <!-- <td
              style="height: 28px; font-size: 20px; line-height: 28px; color: rgb(16 16 16 / 100%); text-align: center"
            >
              <div>企业专属版</div>
              <div>￥ 6980/年</div>
            </td> -->
          </tr>
          <tr>
            <td
              style="
                font-size: 20px;
                font-weight: bold;
                line-height: 28px;
                color: rgb(16 16 16 / 100%);
                text-align: center;
              "
            >
              基础功能
            </td>
            <td colspan="5"></td>
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              二维码生成数量
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">50个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">2000个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">10000个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">50000个</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              二维码长期有效
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              二维码扫描次数
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td> -->
          </tr>
          <tr>
            <td
              style="
                font-size: 20px;
                font-weight: bold;
                line-height: 28px;
                color: rgb(16 16 16 / 100%);
                text-align: center;
              "
            >
              内容展示功能
            </td>
            <td colspan="5"></td>
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              图片/文件上传总容量限额
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">50M</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">1G</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">3G</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">30G</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">200G</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              音视频上传总容量限额
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">500M</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">10G</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">30G</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">150G</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">500G</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              音视频播放次数
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              5次播放体验
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              音视频高清播放流量
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">12G</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">300G</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">600G</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">4500G</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">10000G</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              单个Word、PDF大小限制
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">10MB</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">100MB</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">200MB</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">300MB</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">300MB</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              音视频高清播放流量包
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              购买音频/视频容量包
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              购买图片/文件容量包
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              二维码误删除恢复
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td
              style="
                font-size: 20px;
                font-weight: bold;
                line-height: 28px;
                color: rgb(16 16 16 / 100%);
                text-align: center;
              "
            >
              表单功能
            </td>
            <td colspan="5"></td>
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              表单提交数据总量
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">不限</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              表单提交可上传图片数量
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">1张</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">6张</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">9张</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">9张</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">9张</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              表单提交上传音频视频
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              表单填写消息提醒人数
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">1个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">2个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">5个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">50个</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">150个</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              表单数据导出到Excel
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              最近180天内
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              表单数据API推送
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td
              style="
                font-size: 20px;
                font-weight: bold;
                line-height: 28px;
                color: rgb(16 16 16 / 100%);
                text-align: center;
              "
            >
              后台协作管理
            </td>
            <td colspan="5"></td>
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              子管理员人数
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">2个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">5个</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">20个</td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              协作成员人数
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">1个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">2个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">5个</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">50个</td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">150个</td> -->
          </tr>
          <tr>
            <td
              style="
                font-size: 20px;
                font-weight: bold;
                line-height: 28px;
                color: rgb(16 16 16 / 100%);
                text-align: center;
              "
            >
              企业品牌功能
            </td>
            <td colspan="5"></td>
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              去除页面底部亿码互联标识
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              去除网址安全提示页
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              专属样式库
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              企业自定义登录域名
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              企业独立管理后台
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td
              style="
                font-size: 20px;
                font-weight: bold;
                line-height: 28px;
                color: rgb(16 16 16 / 100%);
                text-align: center;
              "
            >
              微信中二维码展示方式
            </td>
            <td colspan="5"></td>
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              亿码互联小程序
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">H5网页</td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              无标识小程序
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              企业专属小程序
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#fb2222" :size="30"><Close /></el-icon>
            </td>
            <!-- <td style="font-size: 18px; line-height: 25px; color: rgb(16 16 16 / 100%); text-align: center">
              <el-icon color="#81B337" :size="30"><Check /></el-icon>
            </td> -->
          </tr>
          <tr>
            <td></td>
            <td style="width: 200px; height: 100px; border-left: none">
              <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                <el-button
                  class="mt-10"
                  color="#333333"
                  size="large"
                  style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                  >使用</el-button
                >
              </div>
            </td>
            <td style="width: 200px; height: 100px; text-decoration: line-through">
              <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                <el-button
                  class="mt-10"
                  color="#F8D202"
                  size="large"
                  style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                  @click="open"
                  >立即购买
                </el-button>
              </div>
            </td>
            <td style="width: 200px; height: 100px; text-decoration: line-through">
              <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                <el-button
                  class="mt-10"
                  color="#F8D202"
                  size="large"
                  style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                  @click="open"
                  >立即购买
                </el-button>
              </div>
            </td>
            <td style="width: 200px; height: 100px; text-decoration: line-through">
              <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                <el-button
                  class="mt-10"
                  color="#F8D202"
                  size="large"
                  style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                  @click="open"
                  >立即购买
                </el-button>
              </div>
            </td>
            <!-- <td style="width: 200px; height: 100px; text-decoration: line-through">
              <div style="font-size: 18px; color: rgb(0 0 0 / 100%); text-align: center">
                <el-button
                  class="mt-10"
                  color="#F8D202"
                  size="large"
                  style="width: 100px; height: 34px; margin: 0 auto; font-size: 16px"
                  >立即购买
                </el-button>
              </div>
            </td> -->
          </tr>
        </table>
      </div>
      <div style="background-color: rgb(255 255 255 / 100%)" class="p-10 c">
        <div class="content">
          <div
            class="text-center"
            style="font-size: 30px; font-weight: 800; line-height: 42px; color: rgb(16 16 16 / 100%)"
          >
            合同与发票
          </div>

          <div>
            <el-row class="mt-10">
              <el-col :span="12">
                <div
                  style="
                    position: relative;
                    width: 537px;
                    height: 347px;
                    padding: 20px;
                    margin: 0 auto;
                    background-color: rgb(255 255 255 / 100%);
                    border-radius: 10px;
                    box-shadow: 0 2px 6px 0 rgb(0 0 0 / 40%);
                  "
                >
                  <div style="font-size: 26px; font-weight: 800; color: rgb(86 85 85 / 100%); text-align: center">
                    申请发票
                  </div>
                  <div style="margin-top: 20px; font-size: 22px; color: rgb(86 85 85 / 100%); text-align: left">
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    提供增值税普通发票、增值税专用发票，发票内容为「*信息技术服务*二维码管理系统」；支付完成后，可在「管理后台
                    - 设置 - 账户信息」在线申请发票。
                  </div>
                  <div
                    style="
                      position: absolute;
                      bottom: 20px;
                      left: 0;
                      width: 100%;
                      font-size: 18px;
                      color: rgb(0 0 0 / 100%);
                      text-align: center;
                    "
                  >
                    <el-button
                      class="mt-10"
                      color="#F8D202"
                      size="large"
                      style="width: 120px; height: 45px; margin: 0 auto; font-size: 20px"
                      @click="ElMessage.success('功能开发中...')"
                      >申请发票
                    </el-button>
                  </div>
                </div>
              </el-col>
              <el-col :span="12">
                <div
                  style="
                    position: relative;
                    width: 537px;
                    height: 347px;
                    padding: 20px;
                    margin: 0 auto;
                    background-color: rgb(255 255 255 / 100%);
                    border-radius: 10px;
                    box-shadow: 0 2px 6px 0 rgb(0 0 0 / 40%);
                  "
                >
                  <div style="font-size: 26px; font-weight: 800; color: rgb(86 85 85 / 100%); text-align: center">
                    获取合同
                  </div>
                  <div style="margin-top: 20px; font-size: 22px; color: rgb(86 85 85 / 100%); text-align: left">
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    如需合同请联系在线客服，我们会根据你的信息制作合同并盖章，在3个工作日内处理。亿码互联为付款用户提供标准的商务合同。
                  </div>
                  <div
                    style="
                      position: absolute;
                      bottom: 20px;
                      left: 0;
                      width: 100%;
                      font-size: 18px;
                      color: rgb(0 0 0 / 100%);
                      text-align: center;
                    "
                  >
                    <el-button
                      class="mt-10"
                      color="#F8D202"
                      size="large"
                      style="width: 120px; height: 45px; margin: 0 auto; font-size: 20px"
                      @click="kf = true"
                      >联系客服
                    </el-button>
                  </div>
                </div>
              </el-col>
            </el-row>
          </div>
          <div style="margin-top: 40px; background-color: rgb(239 239 239 / 40%)" class="p-10 c">
            <div class="content">
              <div
                class="text-center"
                style="font-size: 30px; font-weight: 800; line-height: 42px; color: rgb(16 16 16 / 100%)"
              >
                常见问题
              </div>

              <el-row class="mt-10">
                <el-col :span="12">
                  <div class="m-2" style="font-size: 20px; font-weight: 600">购买付费版本有优惠吗？</div>
                  <div class="m-2">
                    购买1年没有优惠，一次性购买多年有折扣优惠，购买2年8.5折，购买3年7折，购买5年6折，除此之外，暂无其它优惠方案。
                  </div>
                  <div class="m-2 mt-8" style="font-size: 20px; font-weight: 600">怎么支付？支持对公转账吗？</div>
                  <div class="m-2">
                    支持微信、支付宝以及对公转账。对公用户，请在购买页选择「对公转账」，提交「公司全称、手机号」后，根据提示的收款信息安排转账，我们会在到款后的1个工作日内开通。
                  </div>

                  <div class="m-2" style="font-size: 20px; font-weight: 600">使用一段时间后，可以升级版本吗？</div>
                  <div class="m-2">
                    在付费服务期内可以补差价升级，补差价升级后的到期时间和原来版本的到期时间一致。<br />
                    升级费用 = 版本差价 * 升级时长 * 升级折扣。<br />
                    升级时长：付费服务到期时间与现在的时间差，以年为单位。<br />
                    升级折扣：升级也能享受和购买付费版本一样的折扣优惠。
                  </div>
                </el-col>
                <el-col :span="12">
                  <div class="m-2" style="font-size: 20px; font-weight: 600">购买付费版本有优惠吗？</div>
                  <div class="m-2">
                    购买1年没有优惠，一次性购买多年有折扣优惠，购买2年8.5折，购买3年7折，购买5年6折，除此之外，暂无其它优惠方案。
                  </div>
                  <div class="m-2" style="font-size: 20px; font-weight: 600">付费版本到期后，会有什么变化？</div>
                  <div class="m-2">
                    账号将恢复为免费版，已生成的二维码仍可正常扫描，但无法继续享受付费版功能，会重新出现亿码互联标识，容量恢复到50M（无法新建和编辑二维码），无法继续使用高级功能。
                  </div>
                  <div class="m-2" style="font-size: 20px; font-weight: 600">
                    版本升级后的音视频高清播放流量怎么算？
                  </div>
                  <div class="m-2">
                    1.可以立即享受到新版本的图片/文件上传总容量额度。<br />
                    2.会把版本间的音视频高清播放差额流量新增到账号中。<br />
                    3.高清播放流量 = 版本流量差额 * 升级时长。
                  </div>
                </el-col>
              </el-row>
            </div>
          </div>
        </div>
      </div>
    </div>
    <efoot></efoot>
    <el-dialog title="联系客服" v-model="kf" width="320px">
      <img
        src="https://ecodestore.oss-cn-beijing.aliyuncs.com/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_2024-12-01_190105_504.png"
        width="300px"
        height="auto"
      />
    </el-dialog>
  </div>
</template>

<script setup>
import { ref, reactive, toRefs, onMounted } from 'vue';
import { useRoute } from 'vue-router';
import { i30_viptmp_list } from '@/api/index';
import { ElMessage, ElMessageBox } from 'element-plus';
import ehead from '@/views/components/index/head.vue';
import efoot from '@/views/components/index/foot.vue';
const open = () => {
  ElMessageBox.confirm('请到小程序内进行购买', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '关闭',
    type: 'info',
  })
    .then(() => {})
    .catch(() => {});
};
const list = ref([]);
const kf = ref(false);
onMounted(() => {
  i30_viptmp_list().then((res) => {
    console.log('i30_viptmp_list', res);
    list.value = res.data.data.listdata;
    list.value.forEach((item) => {
      item.titleDesc = JSON.parse(item.titleDesc).title;
      item.feeDesc = JSON.parse(item.feeDesc);
    });
    // 过滤 this.list  过滤条件 tName ！= 专属版
    list.value = list.value.filter((item) => {
      return item.tName !== '专属版';
    });
  });
});
</script>
<style scoped lang="less">
.content {
  width: 1200px;
  margin: 0 auto;
}
.c {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 20rpx;
}
.t1 td {
  vertical-align: top; /* 设置单元格内容向上对齐 */
  border: 1px solid #ddd; /* 设置内部边框样式 */
  padding: 8px; /* 设置单元格内边距 */
}
.cell-div {
  display: flex;
  flex-direction: column;
  justify-content: flex-start; /* 使div内容向上对齐 */
}
.t2 td {
  height: 80px;
  padding: 10px;
}

/* 为奇数行设置背景色 */
.t2 tr:nth-child(odd) {
  background-color: rgba(239, 239, 239, 0.4);
}
/* 为偶数行设置背景色 */
.t2 tr:nth-child(even) {
  background-color: #ffffff;
}
.t2 tr > td:first-child {
  width: 350px;
  text-align: left !important;
  padding-left: 40px;
}
</style>

